<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.w3.org/1999/xhtml">
<body>
<!--头部-->
<div th:fragment="header">
    <div class="pre-loader" th:fragment="header1">
        <div class="load-con">
            <img th:src="@{/img/freeze/logo.png}" class="animated fadeInDown" alt="">
            <div class="spinner">
                <div class="bounce1"></div>
                <div class="bounce2"></div>
                <div class="bounce3"></div>
            </div>
        </div>
    </div>

    <header>
        <nav class="navbar navbar-default navbar-fixed-top scrolled" role="navigation">
            <div class="container">
                <!-- Brand and toggle get grouped for better mobile display -->
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse"
                            data-target="#bs-example-navbar-collapse-1">
                        <span class="fa fa-bars fa-lg"></span>
                    </button>
                    <a class="navbar-brand" th:href="${'/'}">
                        <img th:src="@{/img/freeze/logo.png}" alt="" class="logo">
                    </a>
                </div>

                <!-- Collect the nav links, forms, and other content for toggling -->
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <ul class="nav navbar-nav navbar-right">
                        <li><a href="/">主页</a>
                        </li>
                        <li><a href="/caseDisplay/index/1/10">案例展示</a>
                        </li>
                        <li><a href="/newsCenter/1/1/10">新闻中心</a>
                        </li>
                        <li><a href="/ecosphere/index/1/5/1/6">随寻生态圈</a>
                        </li>
                        <li><a th:href="instructions.html">操作指南</a>
                        </li>
                        <li><a class="getApp" href="#getApp">APP下载</a>
                        </li>
                        <li><a href="#support">随寻通登录</a>
                        </li>
                    </ul>
                </div>
                <!-- /.navbar-collapse -->
            </div>
            <!-- /.container-->
        </nav>
        <!--RevSlider-->

    </header>
</div>

<div th:fragment="footer">
    <footer>
        <div class="container">
            <div class="rights">
                <p>Copyright©2012随寻教育科技有限公司 版权所有</p>
            </div>
        </div>
    </footer>
</div>

<!--新闻搜索-->
<div th:fragment="right-bar">
    <aside id="asidebar" class="positionright col-xs-12 col-md-4">
        <div class="padsidebar">
            <ul>
                <li class="widget-container">
                    <h2 class="widget-title">搜索</h2>
                    <form action="#" id="searchform" method="get">
                        <div class="bgsearch">
                            <input type="text" value="" id="s" name="s">
                            <input type="button" value="" class="searchbutton">
                        </div>
                    </form>
                </li>
                <li class="widget-container">
                    <h2 class="widget-title">推荐</h2>
                    <ul id="hotNews-ul">
                        <li th:each="hotNew : ${hotNews}"><a th:attr="href='/newsCenter/getNews/'+ ${hotNew.id}"
                                                             th:text="${hotNew.title}"></a></li>
                    </ul>
                </li>
            </ul>
        </div>
    </aside>
</div>
</body>
</html>
